var tool1=document.querySelector("#left");
var tool2=document.querySelector("#right");
var tool3=document.querySelector("#top");
var tool4=document.querySelector("#bottom");
var hidden=document.querySelector("#hidden");
var tip=document.querySelector("#tips");
tip.onkeydown=function(ev){
    var tips=document.querySelector(".box").querySelectorAll("span");
    var val=tip.value;
    if(ev.keyCode=='13'){
        for(var i=0;i<tips.length;i++){
            tips[i].innerHTML=val;
        }
    }
}
function display(tips){
    var directionTips=document.querySelector(tips);
    directionTips.style.display="block";
}
tool1.onclick=function(){
    display(".leftTips");
};
tool2.onclick=function(){
    display(".rightTips");
};
tool3.onclick=function(){
    display(".topTips");
};
tool4.onclick=function(){
    display(".bottomTips");
};
hidden.onclick=function(){
    var tips=document.querySelector(".box").querySelectorAll("span");
    for(var i=0;i<tips.length;i++){
        tips[i].style.display="none";
        tips[i].innerHTML="我是tips";
        tip.value="";
    }
}
